<%- include('../includes/head.ejs') %>

<link rel="stylesheet" href="/css/forms.css" />
<link rel="stylesheet" href="/css/product.css" />

</head>
<body>

<%- include('../includes/navigation.ejs') %>
<main>
    <form class="product-form" action="/admin/<% if(editing) { %>edit-product<% } else { %>add-product <% } %>" method="post">
        <div class="form-control">
            <label for="title">Title</label>
            <input type="text" name="title" id="title" value="<% if(editing) { %><%= product.title%><% }  %> "/>
        </div>
        <div class="form-control">
            <label for="imageUrl">Image URL</label>
            <input type="text" name="imageUrl" id="imageUrl" value="<% if(editing) { %><%= product.imageUrl%><% }  %> "/>
        </div>
        <div class="form-control">
            <label for="price">Price</label>
            <input type="number" name="price" id="price" step="0.01" value="<% if(editing) { %><%= product.price%><% }  %> "/>
        </div>
        <div class="form-control">
            <label for="description">Description</label>
            <textarea name="description" id="description" rows="5" value="<% if(editing) { %><%= product.description%><% }  %> "></textarea>
        </div>

        <% if(editing) { %>
            <input type="hidden" value="<%= product.id %>" name="productId"/>
            <% } %>

        <button class="btn" type="submit">
            <% if(editing) { %>
            Update Product <% } else { %>
            Add Product
            <% } %>
        >
        </button>
    </form>
</main>

<%- include('../includes/end.ejs') %>